<template>
 <view>
  <div class='app'>
   <div class='toptext'>订单统计</div>
   <div class='content'>
    <div class='left'>
     <span>今日订单数量</span>
     <span>本月订单数量</span>
     <span>本季度订单数量</span>
    </div>
    <div class='right'>
     <span>{{TodayOrder}}单</span>
     <span>{{monthOrder}}单</span>
     <span>{{quaterOrder}}单</span>
    </div>
   </div>
  </div>
 </view>
</template>

<script>
 import {baseUrl} from "../../libs/request.js"
 export default {
  data() {
   return {
    TodayOrder:"",
    monthOrder:"",
    quaterOrder:""
   }
  },
  onLoad(params) {
   this.getData();
  },
  methods: {
   getData() {
    let riderInfo =  uni.getStorageSync("riderInfo")
    let riderId = riderInfo.riderid
    console.log(riderInfo)
    uni.request({
    url: baseUrl + "/riderOrder/searchOrderNum",
    method: 'POST',
    data: {
     // goodsId: this.$data.goodsId
     riderid:riderId
    },
    header: {
     "Content-Type": "application/x-www-form-urlencoded"
    },
    success: (res) => {
     this.TodayOrder = res.data.TodayOrder,
     this.monthOrder = res.data.monthOrder,
     this.quaterOrder = res.data.quaterOrder
    }
    })
   },
  }
 }
</script>


<style lang="scss">
* {
 margin: 0;
 padding: 0;
}
.app {
 background-color: #f2f6f9;
 display: flex;
 flex-direction: column;
 align-items: center;
 height: 100vh;
 .toptext {
  margin-top: 30rpx;
  font-size: 18px;
  background-color: #fff;
  border-radius: 10px;
  width: 90%;
  padding: 20rpx 10rpx;
  text-align: center;
  color: #575757;
 }
 .content {
  box-sizing: border-box;
  border-radius: 20px;
  margin-top: 30rpx;
  font-size: 14px;
  background-color: #fff;
  width: 90%;
  padding: 30px 5px;
  display: flex;
  .left {
   width: 200rpx;
   display: flex;
   flex-direction: column;
   color: #95a5ac;
   span {
    margin-bottom: 15rpx;
    height: 40px;
   }
  }
  .right {
   margin-left: 50rpx;
   display: flex;
   flex-direction: column;
   color: #95a5ac;
    span {
     margin-bottom: 15rpx;
     height: 40px;
    }
   }
   }
   }
</style>
